<template>
  <el-table :data="processData" border :header-cell-style="tableRowClassName">
    <el-table-column
      width="120"
      align="center"
      prop="shopName"
      label="店铺名称"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedSalesAmount"
      label="自营成交金额"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="selfOperatedReturnAmount"
      label="自营退款金额"
      width="120"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedRefundRate"
      label="自营退款率"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedOrderCount"
      label="成交订单数"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedCustomerUnitPrice"
      label="平均客单价"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="shopProductVisitorCount"
      label="店铺商品访客数"
      width="120"
    >
    </el-table-column>
    <el-table-column
      width="130"
      align="center"
      prop="selfOperatedProductClickCount"
      label="店铺商品点击次数"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedBuyerCount"
      label="成交人数"
    >
    </el-table-column>
    <el-table-column
      width="130"
      align="center"
      prop="selfOperatedVideoSalesAmount"
      label="短视频成交金额"
    >
    </el-table-column>
    <el-table-column
      width="130"
      align="center"
      prop="selfOperatedVideoOrderCount"
      label="短视频成交订单数"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="selfOperatedVideoReturnAmount"
      label="短视频退款金额"
      width="120"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="selfOperatedLiveSalesAmount"
      label="直播成交金额"
      width="120"
    >
    </el-table-column>

    <el-table-column
      width="120"
      align="center"
      prop="selfOperatedLiveOrderCount"
      label="直播成交订单数"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedLiveReturnAmount"
      label="直播退款金额"
    >
    </el-table-column>
    <el-table-column
      width="130"
      align="center"
      prop="selfOperatedProductCardSalesAmount"
      label="商品卡成交金额"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="selfOperatedProductCardOrderCount"
      label="商品卡成交订单数"
      width="130"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="selfOperatedProductCardReturnAmount"
      label="商品卡退款金额"
      width="120"
    >
    </el-table-column>

    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedOtherSalesAmount"
      label="其他成交金额"
    >
    </el-table-column>
    <el-table-column
      width="120"
      align="center"
      prop="selfOperatedOtherOrderCount"
      label="其他成交订单数"
    >
    </el-table-column>
    <el-table-column
      width="100"
      align="center"
      prop="selfOperatedOtherReturnAmount"
      label="其他退款金额"
    >
    </el-table-column>
    <!-- <el-table-column
      align="center"
      prop="yearSalesYoy"
      label="年度销售额同比"
      width="120"
    >
    </el-table-column>
    <el-table-column
      align="center"
      prop="yearSalesChain"
      label="年度销售额环比"
      width="120"
    >
    </el-table-column> -->
  </el-table>
</template>
<script>
export default {
  props: {
    processData: {
      type: Array,
      default: () => [],
    },
  },
  methods: {
    tableRowClassName({ row, column, rowIndex, columnIndex }) {
      if (column.label.includes("自营")) {
        return "background:#ed7d31 !important;color:#fff ";
      } else if (column.label.includes("短视频")) {
        return "color: #515a6e;background:#c4dbf0 !important;";
      } else if (column.label.includes("直播")) {
        return "background:#ed7d31 !important;color:#fff ";
      } else if (column.label.includes("商品卡")) {
        return "color: #515a6e;background:#c4dbf0 !important;";
      } else if (column.label.includes("其他")) {
        return "background:#ed7d31 !important;color:#fff ";
      }
    },
  },
};
</script>




























































